<template>
  <div class="product-list">
    <t-table
      rowKey="id"
      :data="info.pay"
      :columns="columns"
      :stripe="stripe"
      :bordered="bordered"
      :hover="hover"
      :size="size"
      :height="maxHeight"
      :table-layout="tableLayout ? 'auto' : 'fixed'"
      :showHeader="showHeader"
      cellEmptyContent="-"
      resizable
      :loading="loading"
    >
      <template #money="{row}">
        <p>￥{{row.money}}</p>
      </template>
    </t-table>
  </div>
</template>

<script>
import SelectProduct from "@/pages/order/purchase-list/components/select-product.vue";

export default {
  name: "PayHistory",
  props: {
    info: {
      type: Object,
      default: ()=> {}
    }
  },
  components: {SelectProduct},
  data() {
    return {
      size: 'medium',
      tableLayout: true,
      stripe: false,
      bordered: false,
      hover: true,
      showHeader: true,
      columns: [
        {colKey: 'id', title: '订单ID'},
        {colKey: 'no', title: '编号'},
        {colKey: 'money', title: '金额'},
        {colKey: 'desc', title: '备注'},
        {colKey: 'creation_time', title: '操作时间'},
      ],
      maxHeight: '68vh',
      loading: false,

      options: [
        { label: 'DJI MINI PRO', value: '2' },
        { label: 'DJI MINI03', value: '3' },
      ]
    }
  },
  methods: {
    handleSelect() {
      this.$emit('select')
    }
  }
}
</script>

<style lang="less" scoped>
.product-list {

}
</style>
